<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<style>
    .wrapper{
        width: 300px;
        height: 300px;
        background: red;
    }
    .content{
        width: 200px;
        height: 200px;
        background: orange;
    }
    .box{
        width: 100px;
        height: 100px;
        background: green;
    }
</style>
<body>
    <div class="wrapper">
        <div class="content">
            <div class="box"></div>
        </div>
    </div>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <a href="#">超链接</a>
    <a href="javascript:void(false)">失去超链接功能</a>
</body>
<script>
    var a = document.getElementsByTagName('a')[0];
    var div = document.getElementsByTagName('div')[0];
    var div2 = document.getElementsByTagName('div')[1];
    var div3 = document.getElementsByTagName('div')[2];

    div.addEventListener('click',function(e){
        //取消冒泡功能IE9以上
        e.stopPropagation();
        console.log('div');
    },false);
    div2.addEventListener('click',function(e){
        //阻止事件冒泡
        e.cancelBubble = true;
        console.log('div2');
    },false);
    div3.addEventListener('click',function(e){
        e.stopPropagation();
        console.log('div3');
    },false);
    //event target 写法 
    div.onclick = function(){
        var event = e || window.event;
        var target = event.target || event.srcElement;
    }
    //鼠标右键出现菜单的事件
    document.oncontextmenu = function(){
        console.log("鼠标右键出现菜单的事件")
        //取消出现菜单的事件
        return false;
        // event.preventDefault() //W3C标准 IE9不兼容
        // event.returnValue = false; //兼容IE
    }
    a.onclick = function(){
        return false;
    }
</script>
</html>